<template>
<div>
  <van-nav-bar title="添加就诊人" left-text="返回"
               left-arrow  @click-left="back"/>
  <div>
    <van-form >
      <van-cell-group inset>
        <van-field
            v-model="patient.type"
            is-link
            readonly
            name="picker"
            label="关系"
            placeholder="点击选择关系"
            @click="showtype = true"
        />
        <van-popup v-model:show="showtype" position="bottom">
          <van-picker
              title="请选择与本人关系"
              :columns="types"
              @confirm="selectType"
              @cancel="showtype = false"
          />
        </van-popup>
        <van-field
            v-model="patient.name"
            label="姓名"
            placeholder="请输入姓名"
            :rules="[{ required: true, message: '请填写姓名' }]"
        />
        <van-field
            v-model="patient.cardType"
            is-link
            readonly
            name="picker"
            label="证件类型"
            placeholder="点击选择证件"
            @click="showctype = true"
        />
        <van-popup v-model:show="showctype" position="bottom">
          <van-picker
              title="请选择证件类型"
              :columns="ctypes"
              @confirm="selectcType"
              @cancel="showctype = false"
          />
        </van-popup>
        <van-field
            v-model="patient.cardNo"
            label="证件号码"
            placeholder="请输入证件号码"
            :rules="[{ required: true, message: '请填写证件号码' }]"
        />
        <van-field
            v-model="patient.no"
            label="就诊卡号"
            placeholder="请输入就诊卡号"
            :rules="[{ required: true, message: '请填写就诊卡号' }]"
        />
        <van-cell-group inset>
          <van-field
              v-model="patient.address"
              rows="1"
              autosize
              label="住址"
              type="textarea"
              placeholder="请输入家庭住址"
          />
        </van-cell-group>
        <van-field name="switch" label="是否为默认">
          <template #input>
            <van-switch v-model="patient.ck" />
          </template>
        </van-field>
      </van-cell-group>
      <div style="width: 90%;margin-left: 5%;font-size: 11px;background-color: beige;margin-top: 10px;padding: 10px">
        初次添加就诊人请绑定本院就诊卡号，未持有本院就诊卡的患者需到本院自助机或窗口办理就诊卡后方可进行添加。
      </div>
      <div style="margin: 16px;">
        <van-button round block type="primary" native-type="button" @click="add">
          保存
        </van-button>
      </div>
    </van-form>


  </div>
</div>
</template>

<script setup>
import {ref,onMounted} from "vue";
import axios from "axios";
import {useRouter} from "vue-router";
import {useStore} from "vuex";
const store = useStore()
const router = useRouter()
const  patient=new ref({})

const showtype=ref(false)
const showctype=ref(false)

const types=ref([
  { text: '本人', value: '本人' },
  { text: '夫妻', value: '夫妻' },
  { text: '父母', value: '父母' },
  { text: '子女', value: '子女' },
  { text: '朋友', value: '朋友' }
])
const ctypes=ref([
  { text: '身份证', value: '1' },
  { text: '护照', value: '2' },
  { text: '港澳通行证', value: '3' }
])

const selectType = ({ selectedOptions }) => {
  patient.value.type = selectedOptions[0]?.text;
  showtype.value = false;
}
const selectcType = ({ selectedOptions }) => {
  patient.value.cardType = selectedOptions[0]?.value;
  showctype.value = false;
}
const back=()=>{
  history.back();
}
const add = () => {
  //新增 请求接口 axios
  patient.value.uid=store.state.user.id;
  axios.post("patient/add",patient.value).then(res=>{
    if(res.data.code==0){
      //跳转
      router.push("/patientlist")
    }
  })
}
</script>

<style scoped>

</style>
